<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"    
      xmlns:f="http://java.sun.com/jsf/core">

    <body>
        <ui:composition template="./../MasterPage/masterPage.xhtml">
            <ui:define name="content">                

                <p:panel header="Lista de Viajes Programados" style="width: 100%"> 
                    <h:form id="frmNuevo">
                        <p:growl id="growl" showDetail="true"/>
                        <h:panelGrid id="padre" columns="1" style="width: 100%">
                            <h:panelGrid id="hijo2" columns="1" style="width: 100%">
                                <p:dataTable id="dataTable" var="item" value="#{managedBeanVenta.ListaPendientesPago(managedBeanIniciosesion)}" widgetVar="CargoTable" emptyMessage="Datos no encontrados"
                                             selection="#{managedBeanVenta.objetoVentasMostrar}" selectionMode="single"
                                             rowKey="#{item.idVentas}" paginator="true" rows="150"
                                             >
                                    <p:ajax event="rowSelect" listener="#{managedBeanVenta.onRowSelect}"
                                            update=":frmNuevo:display :frmNuevo:growl" oncomplete="CargoDialogo.show()" />
                                    <p:ajax event="rowUnselect" listener="#{managedBeanVenta.onRowUnselect}" update=":frmNuevo:growl"/>
                                    <f:facet name="header">  
                                        <p:outputPanel>  
                                            <h:outputText value="LISTA DE BOLETOS POR COBRAR" />    
                                        </p:outputPanel>  
                                    </f:facet>
                                 
                                    <p:column  filterMatchMode="contains" filterBy="#{item.venNroDocumento}" style="text-align: center; width: 40px; white-space: normal;" > 
                                        <f:facet name="header">
                                            <h:outputText value="DNI" />
                                        </f:facet>
                                        <h:outputText value="#{item.venNroDocumento}" style=" color: blue; size: 7px; font-weight: bold;"/>
                                    </p:column>
                                    
                                    <p:column  filterMatchMode="contains" filterBy="#{item.cliente.persona.perApellidos}  #{item.cliente.persona.perNombres}" style="text-align: center; width: 40px; white-space: normal;" > 
                                        <f:facet name="header">
                                            <h:outputText value="CLIENTE" />
                                        </f:facet>
                                        <h:outputText value="#{item.cliente.persona.perApellidos}  #{item.cliente.persona.perNombres}" style=" color: blue; size: 7px; font-weight: bold; white-space: normal;"/>
                                    </p:column>
                                    
                                    <p:column id="rutas" filterMatchMode="contains" filterBy="#{item.venNumeracion}" style="text-align: center; width: 40px; white-space: normal;" > 
                                        <f:facet name="header">
                                            <h:outputText value="BOLETO" />
                                        </f:facet>
                                        <h:outputText value="#{item.venNumeracion}" style=" color: black; size: 7px; font-weight: bold;" />
                                    </p:column> 

                                    
                                  <p:column  filterMatchMode="contains" filterBy="#{managedBeanVenta.FechaFormateada(item.venFecha)}" style="text-align: center; width: 40px;" > 
                                        <f:facet name="header">
                                            <h:outputText value="FECHA" />
                                        </f:facet>
                                    <h:outputText value="#{managedBeanVenta.FechaFormateada(item.venFecha)}" style="color: red; size: 7px; font-weight: bold;"/>
                                   
                                  </p:column> 
                                    
                                 
                                    <p:column id="preci" filterMatchMode="contains" filterBy="#{item.venMonto}" style="text-align: center; width: 18px;"  > 
                                        <f:facet name="header">
                                            <h:outputText value="Precio (S/.)" />
                                        </f:facet>
                                        <h:outputText value="#{item.venMonto}" >
                                            <f:convertNumber type="currency" minFractionDigits="2" pattern="#0.00"/>    
                                        </h:outputText>
                                    </p:column>
                                </p:dataTable> 
                            </h:panelGrid>
                        </h:panelGrid>        
                        <p:dialog modal="true" id="dialog" header="VENTA PENDIENTE DE PAGO" widgetVar="CargoDialogo" resizable="false" 
                                  showEffect="explode" hideEffect="explode"  width="490" height="300">
                            <h:panelGrid id="display" columns="1" >
                                
                                <h:panelGrid id="display2" columns="2" style="padding-top: 20px;" cellpadding="5" cellspacing="2">

                                    <h:outputText value="CLIENTE :" style="size: 7px; font-weight: bold;"/>
                                    <h:outputText value="#{managedBeanVenta.objetoVentasMostrar.cliente.persona.perApellidos}  #{managedBeanVenta.objetoVentasMostrar.cliente.persona.perNombres}" style=" color: blue; size: 7px; font-weight: bold;"/>
<h:outputText value="DNI :" style="size: 7px; font-weight: bold;"/>
<h:outputText value="#{managedBeanVenta.objetoVentasMostrar.cliente.persona.perDNI}" style=" color: blue; size: 7px; font-weight: bold;"/>

                                    
                                    
                                     <h:outputText value="AGENCIA :" style="size: 7px; font-weight: bold;"/>
                                     <h:outputText value="#{managedBeanVenta.objetoVentasMostrar.empleado.agencia.ciudad.departamento.depDepartamento} #{managedBeanVenta.objetoVentasMostrar.empleado.agencia.ciudad.ciudCiudad} #{managedBeanVenta.objetoVentasMostrar.empleado.agencia.agenDireccion}" style=" color: blue; size: 7px; font-weight: bold;"/>

                                    <h:outputText value="FECHA DE VIAJE :" style="size: 7px; font-weight: bold;"/>
                                      <h:outputText value="#{managedBeanVenta.FechaFormateada(managedBeanVenta.objetoVentasMostrar.venFecha)}" style="color: red; size: 7px; font-weight: bold;"/>
                                  
                                      
                                        <h:outputText value="RUTA :" style="size: 7px; font-weight: bold;"/>
                                        <h:outputText value="#{managedBeanVenta.objetoVentasMostrar.viaje.ruta.rutaDescripcion}" style=" color: blue; size: 7px; font-weight: bold;"/>

                                      
                                       <h:outputText value="HORA :" style="size: 7px; font-weight: bold;"/>
                                       <h:outputText value="#{managedBeanVenta.objetoVentasMostrar.viaje.viaHoraSalida}" style=" color: blue; size: 7px; font-weight: bold;"/>

                                      
                                      <h:outputText value="BOLETO :" style="size: 7px; font-weight: bold;"/>
                                    <h:outputText value="#{managedBeanVenta.objetoVentasMostrar.venNumeracion}" style=" color: blue; size: 7px; font-weight: bold;"/>

                                    
                                   <h:outputText value="PRECIO(S./):  " style="size: 7px; font-weight: bold;"/>
                                      
                             
                                   <h:outputText value="#{managedBeanVenta.objetoVentasMostrar.venMonto}" style="size: 7px; font-weight: bold;">
                                            <f:convertNumber type="currency" minFractionDigits="2" pattern="#0.00"/>    
                                        </h:outputText>
                              
                                       
                                </h:panelGrid>

                                <h:panelGrid  columns="1"  style="padding-left: 145px;">
                                <p:commandButton value="PAGAR DEUDA PENDIENTE" onclick="confirmationCancelar.show();" type="button"/>
</h:panelGrid>          

                            </h:panelGrid>
                        </p:dialog>
                        <p:confirmDialog id="confirmDialogCANC" message="¿DESEA PAGAR EL BOLETO?"
                                     header="Confirmación"  severity="alert" widgetVar="confirmationCancelar" width="300" height="60">
                        <p:commandButton id="confirmcanc" value="SI" oncomplete="dialog.hide() confirmationCancelar.hide()"
                                         actionListener="#{managedBeanVenta.pagoBoletoCredito()}" />
                        <p:commandButton id="declinecanc" value="NO" onclick="confirmationCancelar.hide();" type="button" />
                    </p:confirmDialog>
                    </h:form>
                </p:panel>
            </ui:define>
        </ui:composition>
    </body>
</html>